﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>商品分类管理</title>
    @await Html.PartialAsync("~/Views/Shared/_Import.cshtml")
</head>
<body>
    <div class="admin-main layui-fluid">
        <div class="layui-card">
            <div class="layui-form layui-card-header">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <div class="layui-inline">
                            <label class="layui-form-label">类型</label>
                            <div class="layui-input-inline">
                                <select name="channelType" autocomplete="off" class="layui-input">
                                    <option value="">类型</option>
                                    <option value="1">产品列表</option>
                                    <option value="2">文章列表</option>
                                    <option value="3">下载中心</option>
                                    <option value="4">单独页面</option>
                                    <option value="5">公司简介</option>
                                    <option value="6">联系我们</option>
                                </select>
                            </div>
                            <label class="layui-form-label">标题</label>
                            <div class="layui-input-inline">
                                <input type="text" name="keyWord" placeholder="请输入关键词" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <button class="layui-btn search" lay-submit="search" lay-filter="LAY-app-contlist-search">
                            <i class="layui-icon layui-icon-search"></i>
                        </button>
                    </div>
                </div>
            </div>
            <div class="layui-card-body">
                <div style="padding-bottom: 10px;">
                    @*<button class="layui-btn layuiadmin-btn-admin" data-type="batchdel">删除</button>*@
                    <button class="layui-btn add" data-type="add">添加</button>
                </div>
                <div id="list" lay-filter="demo"></div>
            </div>
        </div>
    </div>

    <script type="text/html" id="barDemo">
        @*<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>*@
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>

    <script>
        layui.use(['table', "ajax", "msgbox", 'common'], function () {
            var layer = layui.layer; //独立版的layer无需执行这一句
            var $ = layui.$; //独立版的layer无需执行这一句'
            var ajax = layui.ajax;
            var msgbox = layui.msgbox;
            var common = layui.common;
            var table = layui.table;
            //第一个实例
            var tableInst = table.render({
                elem: '#list'
                , url: '/api/content/channel/page'
                , page: true //开启分页
                , cols: [[ //表头
                    { field: 'ChannelName', title: '频道名称', width: '180' }
                    , {
                        field: 'ChannelType', title: '频道类型', width: '120', templet: function (d) {
                            //1产品列表2文章列表3下载中心4单独页面
                            switch (d.ChannelType) {
                                case 1:
                                    return "产品列表";
                                case 2:
                                    return "文章列表";
                                case 3:
                                    return "下载中心";
                                case 4:
                                    return "单独页面";
                                case 5:
                                    return "公司简介";
                                case 6:
                                    return "联系我们";
                            };
                        }
                    }
                    , { field: 'Sort', title: '排序', width: '70' }
                    , {
                        field: 'IsHot', title: '推荐', width: '60', templet: function (d) {
                            switch (d.IsHot) {
                                case 1:
                                    return "是";
                                case 2:
                                    return "否";
                            };
                        }
                    }
                    , {
                        field: 'FatherChannelName', title: '上级栏目', width: '192', templet: function (d) {
                            if (d.FatherChannelName) {
                                return d.FatherChannelName;
                            } else {
                                return "-";
                            }
                        }
                    }
                    , { field: 'CreateDatetime', title: '创建时间', width: '192' }
                    , { width: 158, align: 'center', toolbar: '#barDemo' }
                ]]
                , parseData: function (res) { //res 即为原始返回的数据
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.errorMessage, //解析提示文本
                        "count": res.result.totalCount, //解析数据长度
                        "data": res.result.items //解析数据列表
                    };
                }
            });

            table.on('tool(demo)', function (obj) {
                var data = obj.data;
                if (obj.event === 'detail') {
                    layer.msg('ID的查看操作');
                } else if (obj.event === 'del') {
                    layer.confirm('真的删除行么', function (index) {
                        var channelId = data.ChannelId;
                        msgbox.showLoading();
                        ajax.delete({ channelId: channelId }, "/api/content/channel").success(function (response) {
                            msgbox.closeLoading();
                            if (!response.isSuccessed) {
                                common.msgError(response.errorMessage.Message);
                            }
                            tableInst.reload();
                        });
                        layer.close(index);
                    });
                } else if (obj.event === 'edit') {
                    openEdit(data.ChannelId);
                }
            });

            $(".add").on("click", function () {
                openEdit();
            });
            $(".search").on("click", function () {
                table.reload('list', {
                    where: {
                        keyword: $('[name="keyWord"]').val().trim(),
                        channelType: ($('[name="channelType"]').val() === "" ? null : parseInt($('[name="channelType"]').val()))
                    }
                });
            });
            function openEdit(id) {
                var url = "edit";
                if (id) {
                    url = "edit?channelId=" + id;
                }
                var index = layer.open({
                    type: 2,
                    content: [url, 'no'],
                    maxmin: true,
                    title: "编辑栏目"
                });
                layer.full(index);
            }
        });
    </script>
</body>
</html>
